<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:p="http://primefaces.org/ui"
                template="../templates/principal.xhtml">

    <ui:define name="head">
        <script type="text/javascript">
            function handleClienteRequest(xhr, status, args) {
                if (args.validationFailed || !args.loggedIn) {
                    PF('propostaDialog').show();
                } else {
                    PF('propostaDialog').hide();
                }
                PF('propostaDialog').toggleMaximize();
            }
        </script>
    </ui:define>

    <ui:define name="content" id="content">
        <h:form id="frmProposta">
            <p:panel id="panel" header="Bem Vindo ao Cadastro de Nova Proposta">
                <p:growl id="messages" life="5000" />

                <p:dataTable id="tabProposta" widgetVar="wtabProposta" var="proposta" value="#{propostaBean.lazyModel}" 
                             lazy="true" paginator="true" rows="12" paginatorPosition="top"
                             emptyMessage="Nenhum Registro Retornado ..." resizableColumns="true">

                    <f:facet name="header">
                        STATUS: 1 - Solicitação de Proposta de Prestação de Serviços - Aguardando Documentos Iniciais
                    </f:facet>

                    <p:column headerText="Numero Proposta" sortBy="#{proposta.numProposta}" filterBy="#{proposta.numProposta}">
                        <div style="text-align: left;">
                            <h:outputText value="#{proposta.numProposta}" />
                        </div>
                    </p:column>

                    <p:column headerText="Empreendimento" sortBy="#{proposta.idEmpreendimento.dscEmpreendimento}" filterBy="#{proposta.idEmpreendimento.dscEmpreendimento}">
                        <div style="text-align: left; ">
                            <h:outputText value="#{proposta.idEmpreendimento.dscEmpreendimento}" />
                        </div>
                    </p:column>

                    <p:column headerText="Assunto" sortBy="#{proposta.dscProposta}" filterBy="#{proposta.dscProposta}">
                        <div style="text-align: left; ">
                            <h:outputText value="#{proposta.dscProposta}" />
                        </div>
                    </p:column>

                    <p:column headerText="Empresa" sortBy="#{proposta.idEmpresa.nomEmpresa}" filterBy="#{proposta.idEmpresa.nomEmpresa}">
                        <div style="text-align: left; ">
                            <h:outputText value="#{proposta.idEmpresa.nomEmpresa}" />
                        </div>
                    </p:column>



                    <p:column headerText="Cliente Nome Fantasia/Sobrenome" sortBy="#{proposta.idCliente.nomFantasia}" filterBy="#{proposta.idCliente.nomFantasia}">
                        <div style="text-align: left; ">
                            <h:outputText value="#{proposta.idCliente.nomFantasia}" />
                        </div>
                    </p:column>

                    <p:column style="width: 150px;">
                        <h:panelGrid columns="4" styleClass="actions" cellpadding="0">
                            <p:commandButton id="selectButtonProposta" update=":frmProposta:panel :frmProposta:messages" 
                                             icon="ui-icon-search" title="Visualizar // Alterar Proposta" oncomplete="PF('propostaDialog').show(); PF('propostaDialog').toggleMaximize();">
                                <f:setPropertyActionListener value="#{proposta}" target="#{propostaBean.selectedProposta}" />
                                <f:setPropertyActionListener value="#{false}" target="#{propostaBean.ativa}" />
                            </p:commandButton>

                            <p:commandButton id="finalizarButtonProposta" update=":frmProposta:panel :frmProposta:messages" 
                                             icon="ui-icon-note" title="Finalizar Etapa da Proposta" oncomplete="PF('confirmationFinalizar').show();">
                                <f:setPropertyActionListener value="#{proposta}" target="#{propostaBean.selectedProposta}" />
                            </p:commandButton>

                            <p:commandButton id="excluirButtonProposta" update=":frmProposta:panel :frmProposta:messages" 
                                             icon="ui-icon-trash" title="Excluir Proposta" oncomplete="PF('confirmation').show();">
                                <f:setPropertyActionListener value="#{proposta}" target="#{propostaBean.selectedProposta}" />
                            </p:commandButton>
                        </h:panelGrid>
                    </p:column>

                    <f:facet name="footer">
                        <div style="text-align: left;">
                            <p:commandButton id="incluirButtonProposta" actionListener="#{propostaBean.preparaInserir}" 
                                             update=":frmProposta:panel :frmProposta:messages" value="Nova Proposta"
                                             icon="ui-icon-pencil" title="Cadastrar Nova Proposta" oncomplete="PF('propostaDialog').show(); PF('propostaDialog').toggleMaximize();" />
                        </div>
                    </f:facet>
                </p:dataTable>

                <!-- DETALHES PROPOSTA -->
                <p:dialog id="dialog" header="Detalhes Proposta - Solicitação de Proposta de Prestação de Serviços - Aguardando Documentos Iniciais" 
                          widgetVar="propostaDialog" resizable="true" onHide="propostaDialog.toggleMaximize();"
                          maximizable="true" showEffect="explode" hideEffect="explode" style="text-align: left" position="top">

                    <p:tabView id="accordion"  widgetVar="accordion" activeIndex="#{propostaBean.ativaTab}" style="width: 100%;" effect="scale">
                        <p:ajax event="tabChange" update=":frmProposta:accordion:outEmal"/>

                        <p:tab id="tabPrincipal" title="Dados Principais" titleStyle="text-align: center; font-weight: bold;">
                            <p:panel id="panelDetalhe" style="text-align: left; ">
                                <p:panelGrid id="display" style="margin-bottom:50px; text-align: left; width: 100%;">

                                    <p:row>
                                        <p:column colspan="4">
                                            <h:outputText value="Numero Proposta: #{propostaBean.selectedProposta.numProposta}" style="font-weight:bold;" />
                                        </p:column>
                                    </p:row>

                                    <p:row>
                                        <p:column>
                                            <h:outputText value="* Empresa:" />
                                        </p:column>
                                        <p:column colspan="3">
                                            <p:inputText id="inEmpresa" value="#{propostaBean.selectedProposta.idEmpresa.nomEmpresa}" 
                                                         readonly="true" style="width:500px; font-weight:bold; " />

                                            <p:commandButton icon="ui-icon ui-icon-search" title="Pesquisar Empresa" update=":frmProposta:panelEmpresa" onclick="PF('empresaDialog').show();" /> 
                                        </p:column>
                                    </p:row>

                                    <p:row>
                                        <p:column>
                                            <h:outputText value="* Cliente:" />
                                        </p:column>
                                        <p:column>
                                            <p:inputText id="inCliente" value="#{propostaBean.selectedProposta.idCliente.nomFantasia}" 
                                                         readonly="true" style="width:500px; font-weight:bold; " />

                                            <p:commandButton icon="ui-icon ui-icon-search" title="Pesquisar Cliente" update=":frmProposta:panelCliente" onclick="PF('clienteDialog').show();" /> 
                                        </p:column>
                                        <p:column>
                                            <h:outputText value="Empreendimento:" />
                                        </p:column>
                                        <p:column>
                                            <p:inputText id="inEmpreendimento" value="#{propostaBean.selectedProposta.nomEmpreendimento}" 
                                                         readonly="true" style="width:500px; font-weight:bold; " />
                                        </p:column>
                                    </p:row>

                                    <p:row>
                                        <p:column>
                                            <h:outputText value="* Assunto:" />
                                        </p:column>
                                        <p:column colspan="3">
                                            <p:inputText id="inDescricao" value="#{propostaBean.selectedProposta.dscProposta}" maxlength="100" style="width:800px; font-weight:bold; " />
                                        </p:column>
                                    </p:row>

                                    <p:row> 
                                        <p:column>
                                            <h:outputText value="Data Proposta:" />
                                        </p:column>
                                        <p:column colspan="3">
                                            <p:inputMask id="imDatAbert" value="#{propostaBean.selectedProposta.datProposta}" mask="99/99/9999" style="font-weight:bold; ">
                                                <f:convertDateTime type="date" dateStyle="short" pattern="dd/MM/yyyy" />
                                            </p:inputMask>
                                        </p:column>
                                    </p:row>
                                </p:panelGrid>

                                <p:dataTable id="tabDocumento" widgetVar="wtabDocumento" var="documento" value="#{propostaBean.selectedProposta.propostaDocumentoList}" 
                                             paginator="true" rows="5" paginatorPosition="top" emptyMessage="Nenhum Registro Retornado ..." filterEvent="enter">

                                    <p:column headerText="Documento" sortBy="#{documento.nomDocumento}" filterBy="#{documento.nomDocumento}">
                                        <div style="text-align: left; ">
                                            <a href="#{request.contextPath}/documento/#{documento.nomDocumento}" target="_blank"><h:outputText value="#{documento.nomDocumento}" title="Visualizar Documento" /></a>
                                        </div>
                                    </p:column>

                                    <p:column style="width: 50px;">
                                        <h:panelGrid styleClass="actions" cellpadding="0">
                                            <p:commandButton id="excluirButtonDocumento" update=":frmProposta:accordion :frmProposta:messages" 
                                                             icon="ui-icon-trash" title="Excluir Documento" oncomplete="PF('confirmationDocumento').show()">
                                                <f:setPropertyActionListener value="#{documento}" target="#{propostaBean.selectedPropostaDocumento}" />
                                            </p:commandButton>
                                        </h:panelGrid>
                                    </p:column>

                                    <f:facet name="footer">
                                        <div style="text-align: right;">
                                            <p:fileUpload fileUploadListener="#{propostaBean.uploadAction}"  
                                                          mode="advanced" label="Novo Documento" uploadLabel="Selecione o Arquivo PDF"
                                                          update=":frmProposta:accordion :frmProposta:messages"  
                                                          auto="true"  invalidFileMessage="Tipo de Arquivo Inválido! - Somente Arquivos .PDF"
                                                          allowTypes="/(\.|\/)(pdf)$/"/>
                                        </div>
                                    </f:facet>
                                </p:dataTable> 

                                <p:commandButton value="Inserir" oncomplete="handleClienteRequest(xhr, status, args)" rendered="#{propostaBean.ativa}"
                                                 icon="ui-icon-disk" actionListener="#{propostaBean.inserir}" />
                                <p:commandButton value="Alterar" oncomplete="handleClienteRequest(xhr, status, args)" rendered="#{!propostaBean.ativa}"
                                                 icon="ui-icon-disk" actionListener="#{propostaBean.alterar}" />
                                <p:commandButton icon="ui-icon-closethick" value="Fechar" onclick="PF('propostaDialog').hide();" title="Fecha Janela das Propostas!" />
                            </p:panel>
                        </p:tab>
                        <p:tab id="tabEMail" title="E-Mail" titleStyle="text-align: center; font-weight: bold;">
                            <p:panel id="panelEMailDetalhe" style="text-align: left; ">
                                <p:panelGrid id="displayEMail" style="margin-bottom:50px; text-align: left">
                                    <p:row>
                                        <p:column>
                                            <p:commandButton value="Para:" onclick="PF('emailDlg').show()" style="text-align: left; font-weight:bold;"
                                                             icon="ui-icon-folder-open" />
                                        </p:column>
                                        <p:column>
                                            <p:inputText id="to" value="#{propostaBean.email}" style="width: 700px;" readonly="true" />
                                        </p:column>
                                    </p:row>

                                    <p:row>
                                        <p:column>
                                            <h:outputLabel for="subject" value="Assunto: " style="text-align: left;" />
                                        </p:column>
                                        <p:column>
                                            <p:inputText id="subject" value="#{propostaBean.assunto}" style="width: 700px;" />
                                        </p:column>
                                    </p:row>

                                    <p:row>
                                        <p:column colspan="2">
                                            <p:outputPanel id="outEmal" autoUpdate="true">
                                                <p:panelGrid id="displayEmail" style="width: 100%">
                                                    <p:row>
                                                        <p:column>
                                                            <h:outputText value="E-Mail:" />
                                                        </p:column>
                                                        <p:column>
                                                            <p:editor id="inDscEmail" value="#{propostaBean.selectedProposta.dscEmail}" width="1100" height="500" />
                                                        </p:column>
                                                    </p:row>
                                                </p:panelGrid>
                                            </p:outputPanel>
                                        </p:column>
                                    </p:row>

                                    <f:facet name="footer">
                                        <p:row>
                                            <p:column colspan="4">
                                                <div style="text-align: left;">
                                                    <p:commandButton value="Enviar" actionListener="#{propostaBean.enviarEmail}" 
                                                                     icon="ui-icon-mail-open" update=":frmProposta:accordion :frmProposta:messages" process="@all" />
                                                </div>
                                            </p:column>
                                        </p:row>
                                    </f:facet>
                                </p:panelGrid>
                            </p:panel>
                        </p:tab>
                    </p:tabView>

                </p:dialog>

                <!-- EXCLUIR PROPOSTA -->
                <p:dialog header="Confirma a Exclusão dessa Proposta: #{propostaBean.selectedProposta.dscProposta}?" widgetVar="confirmation">

                    <p:commandButton value="Sim" update=":frmProposta:panel :frmProposta:messages" process="@all" oncomplete="PF('confirmation').hide(),PF('propostaDialog').hide()"
                                     actionListener="#{propostaBean.excluir}" />
                    <p:commandButton value="Não" onclick="PF('confirmation').hide();" type="button" />

                </p:dialog>
                <!-- EXCLUIR DOCUMENTO -->
                <p:dialog header="Confirma a Exclusão desse Documento: #{propostaBean.selectedPropostaDocumento.nomDocumento}?" widgetVar="confirmationDocumento">

                    <p:commandButton value="Sim" update=":frmProposta:accordion :frmProposta:messages" process="@all" oncomplete="PF('confirmationDocumento').hide()"
                                     actionListener="#{propostaBean.excluirDocumento}" />
                    <p:commandButton value="Não" onclick="PF('confirmationDocumento').hide();" type="button" />

                </p:dialog>
                <!-- FINALIZAR PROPOSTA -->
                <p:dialog header="Confirma a Finalização dessa Etapa: #{propostaBean.selectedProposta.dscProposta}?" 
                          widgetVar="confirmationFinalizar">

                    <p:commandButton value="Sim" update=":frmProposta:panel :frmProposta:messages" oncomplete="PF('confirmationFinalizar').hide()"
                                     actionListener="#{propostaBean.finalizarProposta}" />
                    <p:commandButton value="Não" onclick="PF('confirmationFinalizar').hide();" type="button" />

                </p:dialog>
                <!-- PESQUISA CLIENTE -->
                <p:dialog id="dialogCliente" header="Pesquisa Cliente" widgetVar="clienteDialog" resizable="true"
                          showEffect="explode" hideEffect="explode" position="right,top">

                    <p:panel id="panelCliente" style="text-align: left">
                        <p:dataTable id="tabClientePesq" widgetVar="wtabCliente" var="cliente" value="#{clienteBean.lazyModel}" filterEvent="enter" 
                                     paginator="true" rows="5" lazy="true" emptyMessage="Nenhum Cliente retornado ..." resizableColumns="true">

                            <f:facet name="header">
                                Pesquise e selecione um Cliente
                            </f:facet>

                            <p:column style="width:4%">   
                                <p:rowToggler />
                            </p:column>

                            <p:column headerText="Razão Social / Nome" sortBy="#{cliente.nomCliente}" filterBy="#{cliente.nomCliente}" style="text-align: center;">
                                <div style="text-align: left; ">
                                    <h:outputText value="#{cliente.nomCliente}" />
                                </div>
                            </p:column>

                            <p:column headerText="Nome Fantasia / Nome Proprietário" sortBy="#{cliente.nomFantasia}" filterBy="#{cliente.nomFantasia}" style="text-align: center;">
                                <div style="text-align: left; ">
                                    <h:outputText value="#{cliente.nomFantasia}" />
                                </div>
                            </p:column>

                            <p:column headerText="C.N.P.J. / C.P.F." sortBy="#{cliente.numCpf}" filterBy="#{cliente.numCpf}" style="text-align: center;">
                                <div style="text-align: left;">
                                    <h:outputText value="#{cliente.numCpf}" />
                                </div>
                            </p:column>

                            <p:column headerText="Pessoa" sortBy="#{cliente.tipCliente}" filterBy="#{cliente.tipCliente}"  
                                      filterOptions="#{clienteBean.tipClienteOptions}" filterMatchMode="exact">
                                <div style="text-align: left; ">
                                    <h:outputText value="#{cliente.dscTipo}" />
                                </div>
                            </p:column>

                            <p:column headerText="Categoria" sortBy="#{cliente.idCategoria.dscCategoria}" filterBy="#{cliente.idCategoria.dscCategoria}">
                                <div style="text-align: left; ">
                                    <h:outputText value="#{cliente.idCategoria.dscCategoria}" />
                                </div>
                            </p:column>

                            <p:column headerText="Tipo" sortBy="#{cliente.staCliente}" filterBy="#{cliente.staCliente}"  
                                      filterOptions="#{clienteBean.staClienteOptions}" filterMatchMode="exact">
                                <div style="text-align: left; ">
                                    <h:outputText value="#{cliente.dscStaCliente}" />
                                </div>
                            </p:column>

                            <p:rowExpansion>
                                <p:dataTable id="clienteEmpreendimentoTable" var="clienteEmpreendimento" value="#{cliente.clienteEmpreendimentoList}" paginator="true" rows="5" 
                                             paginatorPosition="top" emptyMessage="Nenhum Registro Retornado ..." filterEvent="enter">

                                    <p:column headerText="Descrição Empreendimento" sortBy="#{clienteEmpreendimento.dscEmpreendimento}" filterBy="#{clienteEmpreendimento.dscEmpreendimento}" style="text-align: center;">
                                        <div style="text-align: left; ">
                                            <h:outputText value="#{clienteEmpreendimento.dscEmpreendimento}" />
                                        </div>
                                    </p:column>

                                    <p:column headerText="C.N.P.J. / C.P.F." sortBy="#{clienteEmpreendimento.numCpfEmpreendimento}" filterBy="#{clienteEmpreendimento.numCpfEmpreendimento}" style="text-align: center;">
                                        <div style="text-align: left;">
                                            <h:outputText value="#{clienteEmpreendimento.numCpfEmpreendimento}" />
                                        </div>
                                    </p:column>

                                    <p:column headerText="Tipo" sortBy="#{clienteEmpreendimento.dscStaEmpreendimento}" filterBy="#{clienteEmpreendimento.dscStaEmpreendimento}" style="text-align: left;">
                                        <div style="text-align: left;">
                                            <h:outputText value="#{clienteEmpreendimento.dscStaEmpreendimento}" />
                                        </div>
                                    </p:column>

                                    <p:column style="width: 50px;">
                                        <p:panelGrid styleClass="actions" columns="1">
                                            <p:commandButton id="selectButtonCliente" 
                                                             update=":frmProposta:accordion :frmProposta:messages" 
                                                             icon="ui-icon-check" title="Selecionar Cliente" oncomplete="PF('clienteDialog').hide()">
                                                <f:setPropertyActionListener value="#{clienteEmpreendimento}" target="#{propostaBean.selectedEmpreendimento}" />
                                            </p:commandButton>
                                        </p:panelGrid>
                                    </p:column>
                                </p:dataTable>
                            </p:rowExpansion>
                        </p:dataTable>
                    </p:panel>
                </p:dialog>
                <!-- PESQUISA EMPRESA -->
                <p:dialog id="dialogEmpresa" header="Pesquisa Empresa" widgetVar="empresaDialog" resizable="true"
                          width="1000" showEffect="explode" hideEffect="explode" position="right,top">

                    <p:panel id="panelEmpresa" style="text-align: left">
                        <p:dataTable id="tabEmpresa" widgetVar="wtabEmpresa" var="empresa" value="#{empresaBean.lazyModel}" paginator="true" rows="12" lazy="true"
                                     emptyMessage="Nenhum Registro Retornado ..." filterEvent="enter">

                            <f:facet name="header">
                                Selecione uma linha e clique para Manutenção
                            </f:facet>

                            <p:column headerText="Nome Empresa">
                                <h:outputText value="#{empresa.nomEmpresa}" />
                            </p:column>

                            <p:column style="width: 50px;">
                                <p:panelGrid styleClass="actions" columns="1">
                                    <p:commandButton id="selectButtonCliente" 
                                                     update=":frmProposta:accordion :frmProposta:messages" 
                                                     icon="ui-icon-check" title="Selecionar Cliente" oncomplete="PF('empresaDialog').hide()">
                                        <f:setPropertyActionListener value="#{empresa}" target="#{propostaBean.selectedEmpresa}" />
                                    </p:commandButton>
                                </p:panelGrid>
                            </p:column>
                        </p:dataTable>
                    </p:panel>
                </p:dialog>
                <!-- VISUALIZAR PDF -->
                <p:dialog id="dialogPdf" header="Visualizador de Documento" widgetVar="pdfDialog" resizable="true" 
                          width="1500" showEffect="explode" hideEffect="explode" position="left,top" maximizable="true">
                    <p:outputPanel id="outPdf" autoUpdate="true">
                        <p:media id="mdPdf" value="#{propostaBean.documentoView}" width="100%" height="1000px" player="pdf" />
                    </p:outputPanel> 
                </p:dialog>
                <!-- ESCOLHA E-MAIL -->
                <p:dialog widgetVar="emailDlg" header="Pesquisa de E-Mail" showEffect="fade" hideEffect="fade" position="right,top">
                    <p:dataTable id="emailTable" var="email" value="#{propostaBean.viewEmailLazyModel}" filterEvent="enter" resizableColumns="true"
                                 paginator="true" rows="5" paginatorPosition="top" lazy="true" emptyMessage="Nenhum Registro Retornado ...">

                        <p:column style="text-align: left;" filterBy="#{email.name}" sortBy="#{email.name}">
                            <f:facet name="header">
                                <div style="text-align: center">Nome // Razão Social</div>
                            </f:facet>
                            <h:outputText value="#{email.name}"/>
                        </p:column>

                        <p:column style="text-align: left;" filterBy="#{email.complemento}" sortBy="#{email.complemento}">
                            <f:facet name="header">
                                <div style="text-align: center">Complemento // Nome Fantasia</div>
                            </f:facet>
                            <h:outputText value="#{email.complemento}"/>
                        </p:column>

                        <p:column style="text-align: left;" filterBy="#{email.email}" sortBy="#{email.email}">
                            <f:facet name="header">
                                <div style="text-align: center">E-Mail</div>
                            </f:facet>
                            <h:outputText value="#{email.email}"/>
                        </p:column>

                        <p:column style="width: 50px;">
                            <p:panelGrid styleClass="actions" columns="1">
                                <p:commandButton id="selectButtonEMail" update=":frmProposta:accordion :frmProposta:messages" 
                                                 icon="ui-icon-check" title="Selecionar E-Mail" oncomplete="PF('emailDlg').hide()">
                                    <f:setPropertyActionListener value="#{email}" target="#{propostaBean.selectedViewEmail}" />
                                </p:commandButton>
                            </p:panelGrid>
                        </p:column>
                    </p:dataTable>
                </p:dialog>
            </p:panel>

        </h:form>
    </ui:define>
</ui:composition>
